﻿@{
    ViewBag.Title = "Dashboard";

}

<!-- BEGIN PAGE -->
<!-- BEGIN SAMPLE PORTLET CONFIGURATION MODAL FORM-->
<div class="modal fade" id="portlet-config" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
                <h4 class="modal-title">Modal title</h4>
            </div>
            <div class="modal-body">
                Widget settings form goes here
            </div>
            <div class="modal-footer">
                <button type="button" class="btn blue">Save changes</button>
                <button type="button" class="btn default" data-dismiss="modal">Close</button>
            </div>
        </div>
        <!-- /.modal-content -->
    </div>
    <!-- /.modal-dialog -->
</div>
<!-- /.modal -->
<!-- END SAMPLE PORTLET CONFIGURATION MODAL FORM-->
<!-- BEGIN STYLE CUSTOMIZER -->
<!-- TODO:系统配置界面风格颜色-->
<!-- END BEGIN STYLE CUSTOMIZER -->
<!-- BEGIN DASHBOARD STATS -->
<div class="row">
    <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
        <div class="dashboard-stat blue">
            <div class="visual">
                <i class="fa fa-comments"></i>
            </div>
            <div class="details">
                <div class="number">
                    1349
                </div>
                <div class="desc">
                    New Feedbacks
                </div>
            </div>
            <a class="more" href="http://www.keenthemes.com/preview/metronic_admin/index.html#">
                View more <i class="m-icon-swapright m-icon-white"></i>
            </a>
        </div>
    </div>
    <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
        <div class="dashboard-stat green">
            <div class="visual">
                <i class="fa fa-shopping-cart"></i>
            </div>
            <div class="details">
                <div class="number">549</div>
                <div class="desc">New Orders</div>
            </div>
            <a class="more" href="http://www.keenthemes.com/preview/metronic_admin/index.html#">
                View more <i class="m-icon-swapright m-icon-white"></i>
            </a>
        </div>
    </div>
    <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
        <div class="dashboard-stat purple">
            <div class="visual">
                <i class="fa fa-globe"></i>
            </div>
            <div class="details">
                <div class="number">+89%</div>
                <div class="desc">Brand Popularity</div>
            </div>
            <a class="more" href="http://www.keenthemes.com/preview/metronic_admin/index.html#">
                View more <i class="m-icon-swapright m-icon-white"></i>
            </a>
        </div>
    </div>
    <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
        <div class="dashboard-stat yellow">
            <div class="visual">
                <i class="fa fa-bar-chart-o"></i>
            </div>
            <div class="details">
                <div class="number">12,5M$</div>
                <div class="desc">Total Profit</div>
            </div>
            <a class="more" href="http://www.keenthemes.com/preview/metronic_admin/index.html#">
                View more <i class="m-icon-swapright m-icon-white"></i>
            </a>
        </div>
    </div>
</div>
<!-- END DASHBOARD STATS -->
<div class="clearfix"></div>
<div class="row">
    <div class="col-md-6 col-sm-6">
        <!-- BEGIN PORTLET-->
        <div class="portlet solid bordered light-grey">
            <div class="portlet-title">
                <div class="caption"><i class="fa fa-bar-chart-o"></i>Site Visits</div>
                <div class="tools">
                    <div class="btn-group" data-toggle="buttons">
                        <label class="btn default btn-sm active">
                            <input type="radio" name="options" class="toggle" id="option1">Users
                        </label>
                        <label class="btn default btn-sm">
                            <input type="radio" name="options" class="toggle" id="option2">Feedbacks
                        </label>
                    </div>
                </div>
            </div>
            <div class="portlet-body">
                <div id="site_statistics_loading" style="display: none;">
                    <img src="~/Content/Images/loading.gif" alt="loading">
                </div>
                <div id="site_statistics_content" class="display-none" style="display: block;">
                    <div id="site_statistics" class="chart" style="padding: 0px; position: relative;"><canvas class="flot-base" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 505px; height: 300px;" width="505" height="300"></canvas><div class="flot-text" style="position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; font-size: smaller; color: rgb(84, 84, 84);"><div class="flot-x-axis flot-x1-axis xAxis x1Axis" style="position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; display: block;"><div class="flot-tick-label tickLabel" style="position: absolute; max-width: 31px; top: 283px; left: 39px; text-align: center;">2</div><div class="flot-tick-label tickLabel" style="position: absolute; max-width: 31px; top: 283px; left: 71px; text-align: center;">4</div><div class="flot-tick-label tickLabel" style="position: absolute; max-width: 31px; top: 283px; left: 104px; text-align: center;">6</div><div class="flot-tick-label tickLabel" style="position: absolute; max-width: 31px; top: 283px; left: 136px; text-align: center;">8</div><div class="flot-tick-label tickLabel" style="position: absolute; max-width: 31px; top: 283px; left: 165px; text-align: center;">10</div><div class="flot-tick-label tickLabel" style="position: absolute; max-width: 31px; top: 283px; left: 198px; text-align: center;">12</div><div class="flot-tick-label tickLabel" style="position: absolute; max-width: 31px; top: 283px; left: 230px; text-align: center;">14</div><div class="flot-tick-label tickLabel" style="position: absolute; max-width: 31px; top: 283px; left: 263px; text-align: center;">16</div><div class="flot-tick-label tickLabel" style="position: absolute; max-width: 31px; top: 283px; left: 295px; text-align: center;">18</div><div class="flot-tick-label tickLabel" style="position: absolute; max-width: 31px; top: 283px; left: 328px; text-align: center;">20</div><div class="flot-tick-label tickLabel" style="position: absolute; max-width: 31px; top: 283px; left: 360px; text-align: center;">22</div><div class="flot-tick-label tickLabel" style="position: absolute; max-width: 31px; top: 283px; left: 393px; text-align: center;">24</div><div class="flot-tick-label tickLabel" style="position: absolute; max-width: 31px; top: 283px; left: 425px; text-align: center;">26</div><div class="flot-tick-label tickLabel" style="position: absolute; max-width: 31px; top: 283px; left: 458px; text-align: center;">28</div><div class="flot-tick-label tickLabel" style="position: absolute; max-width: 31px; top: 283px; left: 490px; text-align: center;">30</div></div><div class="flot-y-axis flot-y1-axis yAxis y1Axis" style="position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; display: block;"><div class="flot-tick-label tickLabel" style="position: absolute; top: 270px; left: 14px; text-align: right;">0</div><div class="flot-tick-label tickLabel" style="position: absolute; top: 250px; left: 7px; text-align: right;">10</div><div class="flot-tick-label tickLabel" style="position: absolute; top: 231px; left: 7px; text-align: right;">20</div><div class="flot-tick-label tickLabel" style="position: absolute; top: 212px; left: 7px; text-align: right;">30</div><div class="flot-tick-label tickLabel" style="position: absolute; top: 193px; left: 7px; text-align: right;">40</div><div class="flot-tick-label tickLabel" style="position: absolute; top: 173px; left: 7px; text-align: right;">50</div><div class="flot-tick-label tickLabel" style="position: absolute; top: 154px; left: 7px; text-align: right;">60</div><div class="flot-tick-label tickLabel" style="position: absolute; top: 135px; left: 7px; text-align: right;">70</div><div class="flot-tick-label tickLabel" style="position: absolute; top: 116px; left: 7px; text-align: right;">80</div><div class="flot-tick-label tickLabel" style="position: absolute; top: 97px; left: 7px; text-align: right;">90</div><div class="flot-tick-label tickLabel" style="position: absolute; top: 77px; left: 0px; text-align: right;">100</div><div class="flot-tick-label tickLabel" style="position: absolute; top: 58px; left: 0px; text-align: right;">110</div><div class="flot-tick-label tickLabel" style="position: absolute; top: 39px; left: 0px; text-align: right;">120</div><div class="flot-tick-label tickLabel" style="position: absolute; top: 20px; left: 0px; text-align: right;">130</div><div class="flot-tick-label tickLabel" style="position: absolute; top: 1px; left: 0px; text-align: right;">140</div></div></div><canvas class="flot-overlay" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 505px; height: 300px;" width="505" height="300"></canvas><div class="legend"><div style="position: absolute; width: 90px; height: 38px; top: 14px; right: 13px; background-color: rgb(255, 255, 255); opacity: 0.85;"> </div><table style="position:absolute;top:14px;right:13px;;font-size:smaller;color:#545454"><tbody><tr><td class="legendColorBox"><div style="border:1px solid #ccc;padding:1px"><div style="width:4px;height:0;border:5px solid rgb(209,38,16);overflow:hidden"></div></div></td><td class="legendLabel">Unique Visits</td></tr><tr><td class="legendColorBox"><div style="border:1px solid #ccc;padding:1px"><div style="width:4px;height:0;border:5px solid rgb(55,183,243);overflow:hidden"></div></div></td><td class="legendLabel">Page Views</td></tr></tbody></table></div></div>
                </div>
            </div>
        </div>
        <!-- END PORTLET-->
    </div>
    <div class="col-md-6 col-sm-6">
        <!-- BEGIN PORTLET-->
        <div class="portlet solid light-grey bordered">
            <div class="portlet-title">
                <div class="caption"><i class="fa fa-bullhorn"></i>Activities</div>
                <div class="tools">
                    <div class="btn-group pull-right" data-toggle="buttons">
                        <a href="" class="btn blue btn-sm active">Users</a>
                        <a href="" class="btn blue btn-sm">Orders</a>
                    </div>
                </div>
            </div>
            <div class="portlet-body">
                <div id="site_activities_loading" style="display: none;">
                    <img src="~/Content/Images/loading.gif" alt="loading">
                </div>
                <div id="site_activities_content" class="display-none" style="display: block;">
                    <div id="site_activities" style="height: 100px; padding: 0px; position: relative;"><canvas class="flot-base" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 505px; height: 100px;" width="505" height="100"></canvas><canvas class="flot-overlay" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 505px; height: 100px;" width="505" height="100"></canvas></div>
                </div>
            </div>
        </div>
        <!-- END PORTLET-->
        <!-- BEGIN PORTLET-->
        <div class="portlet solid bordered light-grey">
            <div class="portlet-title">
                <div class="caption"><i class="fa fa-signal"></i>Server Load</div>
                <div class="tools">
                    <div class="btn-group pull-right" data-toggle="buttons">
                        <a href="" class="btn red btn-sm active">Database</a>
                        <a href="" class="btn red btn-sm">Web</a>
                    </div>
                </div>
            </div>
            <div class="portlet-body">
                <div id="load_statistics_loading" style="display: none;">
                    <img src="~/Content/Images/loading.gif" alt="loading">
                </div>
                <div id="load_statistics_content" class="display-none" style="display: block;">
                    <div id="load_statistics" style="height: 108px; padding: 0px; position: relative;"><canvas class="flot-base" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 505px; height: 108px;" width="505" height="108"></canvas><div class="flot-text" style="position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; font-size: smaller; color: rgb(84, 84, 84);"><div class="flot-y-axis flot-y1-axis yAxis y1Axis" style="position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; display: block;"><div class="flot-tick-label tickLabel" style="position: absolute; top: 91px; left: 14px; text-align: right;">0%</div><div class="flot-tick-label tickLabel" style="position: absolute; top: 46px; left: 7px; text-align: right;">50%</div><div class="flot-tick-label tickLabel" style="position: absolute; top: 1px; left: 0px; text-align: right;">100%</div></div></div><canvas class="flot-overlay" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 505px; height: 108px;" width="505" height="108"></canvas></div>
                </div>
            </div>
        </div>
        <!-- END PORTLET-->
    </div>
</div>
<div class="clearfix"></div>
